<template>
<a-drawer
    title="修改招生研究方向及导师"
    wrapClassName="fullscreen"
    height="100%"
    placement="bottom"
    :closable="false"
    @close="handleCancel"
    :visible="preViewVisible" >
  <div style="width: 100%">
  <a-card class="card" :bordered="false" >
    <div class="table-page-search-wrapper">
      <a-form layout="vertical">
        <a-row :gutter="48">
          <a-col :sm="{span:24}" :lg="{span:12}" :xl="{span:6}" >
            <a-form-item label="科目码">
              <a-input placeholder="请输入..." v-model="postParams.kmbm" disabled/>
            </a-form-item>
          </a-col>
          <a-col :sm="{span:24}" :lg="{span:12}" :xl="{span:6}">
            <a-form-item label="科目类型">
              <a-input placeholder="请输入..." v-model="postParams.kmlxm" disabled/>
            </a-form-item>
          </a-col>
          <a-col ::sm="{span:24}" :lg="{span:12}" :xl="{span:6}">
            <a-form-item label="科目名称">
              <a-input placeholder="请输入..." v-model="postParams.kmmc" disabled/>
            </a-form-item>
          </a-col>
        </a-row>
      </a-form>
    </div>
  </a-card>
  <a-card class="card" :bordered="false">
    <a-table
      ref="table"
      size="default"
      rowKey="key"
      :columns="columns"
      :loading="loading"
      :dataSource="data"
      :alert="options.alert"
      :rowSelection="options.rowSelection"
      :pagination="false"
    >
    <template slot="action" >
      </template>
      <span slot="serial" slot-scope="text, record, index">
        {{ index + 1 }}
      </span>
    </a-table>
    </a-card>
  </div>
  <div class="drawer-bootom-button" style="z-index:1">
        <div style="float:right">
            <a-button type="primary" @click="handleCancel">关闭窗口</a-button>
        </div>
    </div>
</a-drawer>
</template>

<script>
// import moment from 'moment'
import { STable } from '~'
import { mapState } from 'vuex'

const selectArr = ['TYPE0390', 'TYPE0075', 'TYPE0125', 'TYPE0072']
export default {
  props: {
    preViewVisible: {
      default: false
    },
     info: {
      default: () => []
    }
  },
  components: {
    STable
  },
  data () {
    return {
      loading: false,
      data: [],
      resParams: {
        kmm: 'yx',
        kmmc: 'yx',
        kmlx: '黑暗型'
      },
      postParams: {},
      // 表头
      columns: [
        {
          title: '书目名称',
          dataIndex: 'smmc'
        },
        {
          title: '书目作者',
          dataIndex: 'smzz'
        },
        {
          title: '书目出版社',
          dataIndex: 'smcbs'
        },
        {
          title: '出版日期',
          dataIndex: 'cbrq'
        }
      ],

      // custom table alert & rowSelection
      options: {
        alert: { show: false }
      },
      departmentsAddVisiable: false,
      departmentsEditVisiable: false,
      selectMenu: {
        yx: [] // 院系
      }
    }
  },
  computed: {
    ...mapState({
      systemInfo: state => state.app.systemInfo,
      TYPE0390: state => state.app['TYPE0390'] // 年级
    })
  },
  watch: {
    info (val) {
      // this.data = this.info.map((e) => {
      //   e.key = Math.random().toString(26).substring(2)
      //   return e
      // })
      this.data=val.details;
      this.TYPE0390.forEach(item=>{
        if(item.code==val.kmlxm){
          val.kmlx=item.name
        }
      })
      val.ssyx=val.ssyxm.split(',')
      console.log(this.data)
       this.postParams = {
        kmbm: val.kmbm,
        kmlxm: val.kmlx,
        kmmc: val.kmmc,
        ssyxm:val.ssyx,
        id:val.id,
      };
    }
  },
  created () {

    
    selectArr.forEach(v => {
      this.$store.dispatch('app/setDictionary', v)
    })
  },
  methods: {
  
    
    // 选择院系
    yxChange (code) {
    },
    // 加载数据
    loadData () {
      
    },
    handleCancel () {
      this.$emit('close')
    }
  }
  }

</script>

<style lang="less" scoped>
.card{
  margin-bottom: 20px;
}
</style>
